$primarycolor:rgb(21, 125, 251);
$primaryHoverColor:lighten($primarycolor, 10%);
$bgcolor:rgb(243,243,242);
$whiteColor:white;  
$borderColor:#E9EAEC;
$trivialColor:rgb(153 ,153 ,153);
$colorlight:rgb(130,130,130);

page, body{
    height: 100%;
}
// color
.primary_color{
    color: $primarycolor;
}
.white-bgcolor{
    background-color:$whiteColor;
}
.trivial-color{
    color:$trivialColor;
}
// color end
// 布局
.container_flex{
    display: flex; 
    display: -webkit-flex;
}
.container_flex.column{
    flex-direction: column;  
}
.container_flex.row{
    flex-direction: row;
}
.container_flex.wcenter{
    justify-content:center;
    -webkit-justify-content:center;
}
.container_flex.hcenter{
    align-items: center;
    -webkit-align-items: center;
}
.container_flex.center{
    align-items: center;
    justify-content:center;
    -webkit-align-items: center;
    -webkit-justify-content:center;
    
}
.float_left{
    float: left;
}
.float_right{
    float: right;
}
.pingmucenter {
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
// 布局end
// 字体 begin
.font_32{
    font-size: 32upx;
}
.font_bold{
    font-weight: bold;
}
.bold_color{
    color: #56546c;
}
.text_center{
    text-align: center;
}
.text_left{
    text-align: left;
}
.text_right{
    text-align: right;
}
.oneRow {
    // 文字超出一行省略
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.twoRow {
    // 文字超出两行省略
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
// 字体 end

// 按钮
button[type="primary"]{
    background-color:$primarycolor;
    border-color:$primarycolor;
    color:$whiteColor;
}
button[type="primary"][disabled]{
    opacity: 0.5;
}
button[type="primary"][plain]{
    background-color:transparent;
    color:$primarycolor;
}
button[type="nobgcolor"]{
    background-color:transparent;
}
button[type="nobgcolor"]::after{
    background-color:transparent;
    border:0 !important;
    outline: 0  !important;
}
button.noborder::after{
    border:0 !important;
    outline: 0  !important;
}
.plain-hover{
    background-color:$bgcolor !important;
}
.no-hover{
    background-color:transparent !important;
    border-color:transparent !important;
}
.primary-hover{
    background-color:$primaryHoverColor !important;
    border-color:$primaryHoverColor !important;
}
.primary-btn{
    width: 100%;
    height: 100upx;
    line-height: 100upx;
    border-radius: 50upx;
    text-align: center;
    font-size: 30upx;
    margin-top: 60upx;
}
// .click-hover:active{
//     background-color:$bgcolor !important;
//     border-color:$bgcolor !important;
// }
.click-hover::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    transition: .3s;
    opacity: .5;
    background-color: $bgcolor;
    transform-origin: left;
    transform-origin:center;
    transform: scale(0);
}
.click-hover:active::after {
    transform: scale(1);
}
// 按钮end


// img
.icon_img {
    width: 40upx;
    height: 40upx;
}
// img end
button[type="primary"][disabled]{
    opacity: 0.5;
}